<!DOCTYPE html>
<!-- saved from url=(0050)http://www.1611.com/index.php/Admin/admin/add.html -->
<html><!-- Mirrored from www.zi-han.net/theme/hplus/form_validate.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 20 Jan 2016 14:19:15 GMT --><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title>H+ 后台主题UI框架 - 表单验证 jQuery Validation</title>
    <meta name="keywords" content="H+后台主题,后台bootstrap框架,会员中心主题,后台HTML,响应式后台">
    <meta name="description" content="H+是一个完全响应式，基于Bootstrap3最新版本开发的扁平化主题，她采用了主流的左右两栏式布局，使用了Html5+CSS3等现代技术">

    <link rel="shortcut icon" href="http://www.1611.com/index.php/Admin/admin/favicon.ico"> <link href="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/bootstrap.min14ed.css" rel="stylesheet">
    <link href="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/font-awesome.min93e3.css" rel="stylesheet">
    <link href="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/animate.min.css" rel="stylesheet">
    <link href="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/style.min862f.css" rel="stylesheet">
    <link href="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/layer.css" rel="stylesheet">
    <link href="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/switchery.css" rel="stylesheet">

<link rel="stylesheet" href="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/layer.css" id="layui_layer_skinlayercss"></head>

<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>添加管理员</h5>
                </div>
                <div class="ibox-content">
                    <form action="http://www.1611.com/index.php/Admin/admin/save.html" enctype="multipart/form-data" method="post" class="form-horizontal m-t" id="Form">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">账号：</label>
                            <div class="col-sm-8">
                                <input id="firstname" name="username" class="form-control" type="text">
                                <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 不能包含特殊字符</span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">真实姓名：</label>
                            <div class="col-sm-8">
                                <input id="lastname" name="realName" class="form-control" type="text" aria-required="true" aria-invalid="false">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">头像：</label>
                            <div class="col-sm-8">
                                <input id="img" name="litpic" class="form-control" type="file">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">密码：</label>
                            <div class="col-sm-8">
                                <input id="password" name="password" class="form-control" type="password">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">确认密码：</label>
                            <div class="col-sm-8">
                                <input id="confirm_password" name="confirm_password" class="form-control" type="password">
                                <span class="help-block m-b-none"><i class="fa fa-info-circle"></i> 请再次输入您的密码</span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">分组：</label>
                            <div class="col-sm-8">
                                <select class="form-control m-b" name="title">
                                    <option value="1">超级管理员</option><option value="2">产品管理员</option><option value="3">文章管理员</option><option value="4">留言管理员</option>                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">状态：</label>
                            <div class="col-sm-8">
                                <input type="checkbox" value="1" name="status" id="status" class="js-switch" checked="" data-switchery="true" style="display: none;"><span class="switchery" id="status" name="status" style="background-color: rgb(100, 189, 99); border-color: rgb(100, 189, 99); box-shadow: rgb(100, 189, 99) 0px 0px 0px 16px inset; transition: border 0.4s, box-shadow 0.4s, background-color 1.2s;"><small style="left: 20px; transition: left 0.2s;"></small></span>
                            </div>
                        </div>
                        <div class="form-group">
                            <div class="col-sm-8 col-sm-offset-3">
                                <button class="btn btn-primary" type="submit">提交</button>
                                <button class="btn btn-defualt" type="reset" onclick="history.go(-1)">取消</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/jquery.min.js"></script>
<script src="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/bootstrap.min.js"></script>
<script src="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/content.min.js"></script><div class="gohome"><a class="animated bounceInUp" href="http://www.1611.com/index.php/Admin/admin/index.html?v=4.0" title="返回首页"><i class="fa fa-home"></i></a></div>
<script src="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/jquery.validate.min.js"></script>
<script src="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/messages_zh.min.js"></script>
<script src="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/jquery.form.js"></script>
<script src="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/layer.min.js"></script>
<script src="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/messages_zh.min.js"></script>
<script src="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/switchery.js"></script>
<script type="text/javascript" src="./H+ 后台主题UI框架 - 表单验证 jQuery Validation_files/stats" charset="UTF-8"></script>
<script>
    //表单验证自定义检测方法
    $(document).ready(function(){
        $.validator.addMethod('checkName',function(value, element, param){
            if(/^[a-zA-Z0-9_-]{3,16}$/.test(value)) {
                return true;
            }else{
                return false;
            }
        },"");
        //表单验证
        $('#signupForm').validate({
            rules: {
                username: {
                    required: true,
                    minlength: 3,
                    checkName:true
                },
                password: {
                    required: true,
                    minlength: 5,
                    maxlength:16
                },
                confirm_password: {
                    required: true,
                    minlength: 5,
                    maxlength:16,
                    equalTo: "#password"
                },
                realName: {
                    required: true,
                }
            },
            messages: {
                username: {
                    required: "请输入用户名",
                    minlength: "用户名必需由两个字母组成",
                    checkName:"不能包含特殊字符"
                },
                password: {
                    required: "请输入密码",
                    minlength: "密码长度不能小于 5 个字母",
                    maxlength:"密码长度不能大于 16 个字母"
                },
                confirm_password: {
                    required: "请输入密码",
                    minlength: "密码长度不能小于 5 个字母",
                    equalTo: "两次密码输入不一致"
                },
                realName: "请输入真实姓名"
            },
            submitHandler:function(form){
//                $(form).ajaxSubmit({
//                    success:function(data){
//                        if(data.status > 0){
//                            layer.msg(data.msg, {icon: 6,time: 1000}, function(){
//                                window.location.href="/index.php/Admin/admin/index.html";
//                            });
//                        }else{
//                            layer.msg(data.msg, {icon: 5,time: 1000},function(){
//                                window.location.href="/index.php/Admin/admin/add.html";
//                            });
//                        }
//
//                    },
//                    datatype:'json'
//                })
                var form = new FormData(document.getElementById('Form'));
                $,ajax({
                    url:$(form).attr('action'),
                    type:'post',
                    dataType:'json',
                    data:form,
                    success:function(data){
                        if(data.status > 0){
                            layer.msg(data.msg, {icon: 6,time: 1000}, function(){
                              window.location.href="/index.php/Admin/admin/index.html";
                            });
                        }else{
                            layer.msg(data.msg, {icon: 5,time: 1000},function(){
                              window.location.href="/index.php/Admin/admin/add.html";
                            });
                        }
                    }
                });
            }
        });
        //开关按钮实例化
        var elem = document.querySelector('.js-switch');
        var switchery = new Switchery(elem, { });


    })
</script>



<!-- Mirrored from www.zi-han.net/theme/hplus/form_validate.html by HTTrack Website Copier/3.x [XR&CO'2014], Wed, 20 Jan 2016 14:19:16 GMT -->
<div style="position: static; width: 0px; height: 0px; border: none; padding: 0px; margin: 0px;"><div id="trans-tooltip"><div id="tip-left-top" style="background: url(&quot;chrome-extension://ikkbfngojljohpekonpldkamedehakni/imgs/map/tip-left-top.png&quot;);"></div><div id="tip-top" style="background: url(&quot;chrome-extension://ikkbfngojljohpekonpldkamedehakni/imgs/map/tip-top.png&quot;) repeat-x;"></div><div id="tip-right-top" style="background: url(&quot;chrome-extension://ikkbfngojljohpekonpldkamedehakni/imgs/map/tip-right-top.png&quot;);"></div><div id="tip-right" style="background: url(&quot;chrome-extension://ikkbfngojljohpekonpldkamedehakni/imgs/map/tip-right.png&quot;) repeat-y;"></div><div id="tip-right-bottom" style="background: url(&quot;chrome-extension://ikkbfngojljohpekonpldkamedehakni/imgs/map/tip-right-bottom.png&quot;);"></div><div id="tip-bottom" style="background: url(&quot;chrome-extension://ikkbfngojljohpekonpldkamedehakni/imgs/map/tip-bottom.png&quot;) repeat-x;"></div><div id="tip-left-bottom" style="background: url(&quot;chrome-extension://ikkbfngojljohpekonpldkamedehakni/imgs/map/tip-left-bottom.png&quot;);"></div><div id="tip-left" style="background: url(&quot;chrome-extension://ikkbfngojljohpekonpldkamedehakni/imgs/map/tip-left.png&quot;);"></div><div id="trans-content"></div></div><div id="tip-arrow-bottom" style="background: url(&quot;chrome-extension://ikkbfngojljohpekonpldkamedehakni/imgs/map/tip-arrow-bottom.png&quot;);"></div><div id="tip-arrow-top" style="background: url(&quot;chrome-extension://ikkbfngojljohpekonpldkamedehakni/imgs/map/tip-arrow-top.png&quot;);"></div></div></body></html>